<template>
	<view class="apply-pages" v-if="isLoad">
		
		<view class="apply-form pl-lg pr-lg">
			
			<view class="shop-bg flex-column">
				<view class="f-sm-title c-black flex-center">商家免单会</view>
				<view class="f-title c-black ml-sm flex-warp">
					<view class="f-title c-black ml-sm">
						1.凡是加入
					</view>
					<view style="height: 40px;">
						<input v-model="form.user_name" style="min-height: 25px; height: 25px; font-size: 26rpx; border: 1px solid black; width: 350rpx; border-radius: 10rpx;" type="text" placeholder="请输入店铺名称" />
					</view>
					<view class="f-title c-black">
						商家免单会，所有商品及服务均享受
					</view>
					
					<view style="height: 40px;">
						<input v-model="form.user_name1" style="min-height: 25px; height: 25px; font-size: 26rpx; border: 1px solid black; width: 250rpx; border-radius: 10rpx;" type="text" placeholder="请输入本店会员折扣" />
					</view>
					<view class="f-lg-title c-warning"> — </view>
					<view style="height: 40px;">
						<input v-model="form.user_name2" style="min-height: 25px; height: 25px; font-size: 26rpx; border: 1px solid black; width: 250rpx; border-radius: 10rpx;" type="text" placeholder="请输入普通会员折扣" />
					</view>
					<view class="f-title c-warning">折</view>
					<view class="f-title c-black">
						消费福利。
					</view>
				</view>
				<view class="f-title c-black ml-sm mt-lg">
					2.致力打造全网商业服务平台，共享消费券，分享获得劳务福利。
				</view>
				<view class="f-title c-black ml-sm mt-lg">
					3.力求互惠互利，平等交易的原则。发扬互帮互助的光荣传统。建立共存共荣优良的百业联盟平台。
				</view>
				
				<view class="flex-warp f-title c-black ml-sm mt-lg">
					<view class="f-title c-black ml-sm">
						备注
					</view>
					<view style="height: 40px;">
						<input v-model="form.user_name3" maxlength="50" style="min-height: 25px; height: 25px; font-size: 26rpx; border: 1px solid black; width: 320rpx; border-radius: 10rpx;" type="text" placeholder="请输入自定义优惠(0-50字)" />
					</view>
				</view>
				
				<view class="flex-between mb-lg ml-lg mr-lg">
					<view class="btn f-desc c-black radius-10 pl-lg pr-lg"></view>
					<view class="f-desc c-warning"></view>
					<view class="f-desc c-black radius-10 pl-lg pr-lg">{{form.user_name}}宣</view>
				</view>
				
				<view class="flex-between mt-lg mb-lg ml-lg mr-lg">
					<view @click="goEdit" class="btn f-desc c-black radius-10 pl-lg pr-lg">编辑</view>
					<view class="f-desc c-black">成为会员后可编辑店名及折扣</view>
					<view class="btn f-desc c-black radius-10 pl-lg pr-lg">提交</view>
				</view>
				
			</view>

		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from "vuex"
	export default {
		components: {},
		data() {
			return {
				isLoad: false,
				options: {},
				form: {
					id: 0,
					user_name: '',
					mobile: '',
					address: '',
					address_info: '',
					lng: '',
					lat: '',
					text: '',
					status: 0
				},
				rule: [{
						name: "user_name",
						checkType: "isNotNull",
						errorMsg: "输入店铺名称",
						regType: 2
					}, {
						name: "mobile",
						checkType: "isMobile",
						errorMsg: "请选择经营类目"
					},
					{
						name: "address",
						checkType: "isNotNull",
						errorMsg: "设置地区"
					},
					{
						name: "address_info",
						checkType: "isNotNull",
						errorMsg: "输入街道、楼牌号等",
						regType: 2
					},
				],
				lockTap: false,
				classIndex: 0,
				classList: [
					{
						id: 6,
						name: "交友",
						image: "/static/main/01.png",
						path: "/service/pages/user-list?id=6",
					},
					{
						id: 2,
						name: "心灵",
						image: "/static/main/02.png",
						path: "/service/pages/user-list-other?id=2",
					},
					{
						id: 273,
						name: "疗愈",
						image: "/static/main/03.png",
						path: "/service/pages/user-list-other?id=273",
					},
					{
						id: 252,
						name: "娱乐",
						image: "/static/main/04.png",
						path: "/service/pages/user-list-other?id=252",
					},
					{
						id: 1,
						name: "课堂",
						image: "/static/main/05.png",
						path: "/service/pages/user-list-other?id=1",
					},
					{
						id: 14,
						name: "美食",
						image: "/static/main/06.png",
						path: "/service/pages/user-list-other?id=14",
					},
					{
						id: 7,
						name: "养生",
						image: "/static/main/07.png",
						path: "/service/pages/user-list-other?id=7",
					},
					{
						id: 3,
						name: "医美",
						image: "/static/main/08.png",
						path: "/service/pages/user-list-other?id=3",
					},
					{
						id: 16,
						name: "休闲",
						image: "/static/main/09.png",
						path: "/service/pages/user-list-other?id=16",
					},
					{
						id: 11,
						name: "食疗",
						image: "/static/main/10.png",
						path: "/service/pages/user-list-other?id=11",
					},
					{
						id: 10,
						name: "家政",
						image: "/static/main/11.png",
						path: "/service/pages/user-list-other?id=10",
					},
					{
						id: 17,
						name: "自媒体",
						image: "/static/main/12.png",
						path: "/service/pages/user-list-other?id=17",
					},
					{
						id: 15,
						name: "创业",
						image: "/static/main/13.png",
						path: "/service/pages/user-list-other?id=15",
					},
					{
						id: 287,
						name: "健身",
						image: "/static/main/14.png",
						path: "/service/pages/user-list-other?id=287",
					},
					{
						id: 253,
						name: "电影",
						image: "/static/main/15.png",
						path: "/service/pages/user-list-other?id=253",
					},
					{
						id: 284,
						name: "汽车",
						image: "/static/main/16.png",
						path: "/service/pages/user-list-other?id=284",
					},
					{
						id: 58,
						name: "科技",
						image: "/static/main/17.png",
						path: "/service/pages/user-list-other?id=58",
					},
					{
						id: 13,
						name: "旅游",
						image: "/static/main/18.png",
						path: "/service/pages/user-list-other?id=13",
					},
					{
						id: 286,
						name: "首饰",
						image: "/static/main/19.png",
						path: "/service/pages/user-list-other?id=286",
					},
					{
						id: 5,
						name: "酒店",
						image: "/static/main/21.png",
						path: "/service/pages/user-list-other?id=5",
					},
					{
						id: 289,
						name: "减肥",
						image: "/static/main/20.png",
						path: "/service/pages/user-list-other?id=289",
					},
					{
						id: 285,
						name: "房产",
						image: "/static/main/22.png",
						path: "/service/pages/user-list-other?id=285",
					},
					{
						id: 12,
						name: "维修服务",
						image: "/static/main/23.png",
						path: "/service/pages/user-list-other?id=12",
					},
					{
						id: 288,
						name: "康复理疗",
						image: "/static/main/24.png",
						path: "/service/pages/user-list-other?id=288",
					},
					{
						id: 18,
						name: "其它",
						image: "/static/main/25.png",
						path: "/service/pages/user-list-other?id=18",
					},
				]
				
				
			}
		},
		computed: mapState({
			primaryColor: state => state.config.configInfo.primaryColor,
			subColor: state => state.config.configInfo.subColor,
		}),
		onLoad(options) {
			this.options = options
			this.initIndex()
		},
		methods: {
			...mapMutations(['updateUserItem', 'updateOrderItem']),
			async initIndex() {
				// #ifdef H5
				if (this.$jweixin.isWechat()) {
					await this.$jweixin.initJssdk();
					this.$jweixin.wxReady(() => {
						this.$jweixin.hideOptionMenu()
					})
				}
				// #endif
				let {
					id = 0
				} = this.options
				if (!id) {
					this.isLoad = true
					this.$util.setNavigationBarColor({
						bg: this.primaryColor
					})
					return
				}
				let data = await this.$api.mine.addressInfo({
					id
				})
				for (let key in this.form) {
					this.form[key] = data[key]
				}
				this.$util.setNavigationBarColor({
					bg: this.primaryColor
				})
				this.isLoad = true
			},
			// 选择地区
			async toChooseLocation(e) {
				await this.$util.checkAuth({
					type: 'userLocation'
				})
				let [, {
					address = '',
					longitude,
					latitude
				}] = await uni.chooseLocation();
				if (!address) return
				this.form.address = address
				this.form.lng = longitude
				this.form.lat = latitude
			},
			classChange(e, val) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.classIndex = e.target.value
				// this.form.class_id = this.classList[this.classIndex].id
				// this.$util.goUrl({
				// 	url: '/user/pages/shop/list',
				// })
			},
			async toDel() {
				let [res_del, {
					confirm
				}] = await uni.showModal({
					title: '提示',
					content: "请确认是否要删除此数据?"
				})
				if (!confirm) return;
				let {
					id
				} = this.form
				let {
					check_id
				} = this.$util.getPage(-1)
				if (this.lockTap) return
				this.lockTap = true
				this.$util.showLoading()
				try {
					await this.$api.mine.addressDel({
						id
					})
					this.$util.hideAll()
					this.$util.showToast({
						title: `删除成功`,
					});
					this.lockTap = false
					if (id == check_id) {
						this.updateOrderItem({
							key: 'haveOperItem',
							val: true
						})
					}
					setTimeout(() => {
						this.$util.back()
						this.$util.goUrl({
							url: 1,
							openType: `navigateBack`
						})
					}, 1000)
				} catch (e) {
					setTimeout(() => {
						this.lockTap = false
						this.$util.hideAll()
					}, 2000)
				}
			},
			//表单验证
			validate(param) {
				let validate = new this.$util.Validate();
				this.rule.map(item => {
					let {
						name,
					} = item
					validate.add(param[name], item);
				})
				let message = validate.start();
				return message;
			},
			async submit() {
				// let param = this.$util.deepCopy(this.form)
				// let msg = this.validate(param);
				// if (msg) {
				// 	this.$util.showToast({
				// 		title: msg
				// 	});
				// 	return;
				// }
				// if (this.lockTap) return
				// this.lockTap = true
				// this.$util.showLoading()
				// try {
				// 	let methodModel = param.id ? `addressUpdate` : `addressAdd`
				// 	await this.$api.mine[methodModel](param)
				// 	this.$util.hideAll()
				// 	this.$util.showToast({
				// 		title: `申请成功`,
				// 	});
				// 	setTimeout(() => {
				// 		this.$util.back()
				// 		this.$util.goUrl({
				// 			url: 1,
				// 			openType: `navigateBack`
				// 		})
				// 	}, 1000)
				// } catch (e) {
				// 	setTimeout(() => {
				// 		this.lockTap = false
				// 		this.$util.hideAll()
				// 	}, 2000)
				// }
			}
		}
	}
</script>

<style lang="scss">
	.shop-bg {
		background-color: #fff;
		border-radius: 42rpx;
		margin: 10rpx 0rpx;
		padding: 15rpx 15rpx;
		margin-bottom: 40rpx;
		.btn {
			background-color: #f4cf89;
		}
	}
	// style="min-height: 25px; height: 25px; border: 1px solid #fff; width: 350rpx;"
	.item-input {
		// padding: 0rpx, 0;
		// margin:  0rpx, 0;
		// min-height: 10rpx;
		// height: 10rpx;
		font-size: 26rpx;
		// color: #000;
		// border-radius: 10rpx;
		border: 4rpx solid black;
		min-height: 25px;
		height: 25px;
		width: 350rpx;
	}
</style>
